<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets" template="index.xhtml">

	<ui:define name="body">

		<h:outputScript>	
	$(document).ready(function(){	
				$(".submenu-active").removeClass('submenu-active'); 
				$("#general").addClass('submenu-active'); 
		});
	</h:outputScript>
		<h1>Général</h1>

		<h:form id="generalFormId" >
		    <p:growl id="messagesGrowl" showDetail="true"/>  
		 <p:messages id="messages" showDetail="true" autoUpdate="true" closable="true" />  
			<table class="nostyle">
				<tr>
					<td><h3>
							<h:outputLabel for="nom" value="Nom de l'enseigne " />
						</h3></td>
					<td colspan="2"><p:inputText style="width:300px"
							value="#{enseigneMB.enseigne.nom}" id="enseigneId">
							<f:validateLength minimum="5" />
							<p:ajax event="blur" update="nomMsg" />
						</p:inputText> <p:message id="nomMsg" for="enseigneId" display="text" /></td>
				</tr>
				<tr>
					<td>
						<h3>
							Coordooneé de <br></br> l'administrateur
						</h3>
					</td>
					<td colspan="2">Désigner les adresses email de contact pour
						les communications de service, <br></br>notamment les
						notifications de paiement et tout abonnement.
					</td>
				</tr>

			</table>
			<table class="nostyle">
				<tr>
					<td width="160"></td>
					<td colspan="2"><h4>Compte Administrateur Principale</h4></td>
				</tr>
			</table>

			<table class="nostyle">
				<tr>
					<td rowspan="5" width="160"></td>
					<td>Prénom :*</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.principalAdminUser.lastName}" /></td>
				</tr>
				<tr>
					<td>Nom :*</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.principalAdminUser.firstName}" /></td>
				</tr>
				<tr>
					<td>Fonction:*</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.principalAdminUser.fonction}" /></td>
				</tr>
				<tr>
					<td>Adresse email:*</td>
					<td><p:inputText style="width:160px"  value="#{enseigneMB.enseigne.principalAdminUser.email}" /></td>
				</tr>
				<tr>
					<td>Numero de telephone:*</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.principalAdminUser.telephone}" /></td>
				</tr>
			</table>

			<table class="nostyle">
				<tr>
					<td width="160"></td>
					<td colspan="2"><h4>Compte Administrateur Delegué</h4></td>
				</tr>
			</table>

			<table class="nostyle">
				<tr>
					<td rowspan="5" width="160"></td>
					<td>Prénom :</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.delegateAdminUser.lastName}" /></td>
				</tr>
				<tr>
					<td>Nom :</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.delegateAdminUser.firstName}" /></td>
				</tr>
				<tr>
					<td>Fonction:</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.delegateAdminUser.fonction}" /></td>
				</tr>
				<tr>
					<td>Adresse email:</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.delegateAdminUser.email}"/></td>
				</tr>
				<tr>
					<td>Numero de telephone:</td>
					<td><p:inputText style="width:160px" value="#{enseigneMB.enseigne.delegateAdminUser.telephone}"/></td>
				</tr>
			</table>

			<table class="nostyle">
				<tr>
					<td width="160"></td>
					<td colspan="2"><h4>* Champs obligatoire</h4></td>
				</tr>
			</table>

			<table class="nostyle">

				<tr>
					<td>
						<h3>Langue :</h3>
					</td>
					<td>Langue par default des utilisateurs de StroeForce</td>
				</tr>
				<tr>
					<td></td>
					<td><h:selectOneMenu id="generalEnseignelangueId" style="width:160px" value="#{enseigneMB.selectedLanguage}">
							<f:selectItem itemLabel="Francais" itemValue="1" />
							<f:selectItem itemLabel="Englais" itemValue="2" />
							<f:selectItem itemLabel="Espagnol" itemValue="3" />
							<f:selectItem itemLabel="Allmend" itemValue="4" />
							<f:selectItem itemLabel="Italien" itemValue="5" />
						</h:selectOneMenu></td>
				</tr>

				<tr>
					<td>
						<h3>Fuseau Horaire :</h3>
					</td>
					<td><h:selectOneMenu id="horaire" style="width:160px" value="#{enseigneMB.selectedFuseauHoraire}">

							<f:selectItem itemLabel="Paris,Bruxelles UTC(+1)" itemValue="1" />
							<f:selectItem itemLabel="Tunis,Madrid UTC(+1)" itemValue="2" />
							<f:selectItem itemLabel="Istanbul UTC(+2)" itemValue="3" />
							<f:selectItem itemLabel="Tokyo,Seoul UTC(+9)" itemValue="4" />


						</h:selectOneMenu></td>
				</tr>
				<tr>
					<td>
						<h3>Logo de l'enseigne</h3>
					</td>
					<td><p:selectOneRadio immediate="true">
							<f:selectItem itemLabel="Logo par default  "
								itemValue="logo par default" />
						</p:selectOneRadio></td>
				</tr>
				<tr>
					<td></td>
					<td><img src="tmp/logo.jpg" width="194" height="70"
						alt="Strogifv2" /></td>
				</tr>
				<!--           <br></br> -->
				<tr>
					<td></td>
					<td><p:selectOneRadio immediate="true" disabled="true" >
							<f:selectItem itemLabel="logo personalise" itemValue="logo perso"  />
						</p:selectOneRadio></td>
				</tr>

				<tr>
					<td></td>
					<td><p:fileUpload fileUploadListener="#{enseigneMB.handleFileUpload}"  
            mode="advanced"   
            update="messages"  
            sizeLimit="100000"   
            allowTypes="/(\.|\/)(gif|jpe?g|png)$/"/>  </td>
				</tr>
				<tr>
					<td></td>
					<td>
						<h4>
							Transfert d'une image personalisée<br />
						</h4> Votre logo personalisé sera affiché pour tous les services de
						Storeforce. le fichier image doit etre au format PNG ou GIF
						(143*59). <br />L'image personalisée actuelle sera remplacé
						aprés le transfert .tous les utilisateurs de StoreForce verront
						ce changement .<br />
					</td>
				</tr>

				<tr>
					<td>
						<h3>
							Foire Aux Questions <br></br>(FAQ)
						</h3>
					</td>
					<td><table class="nostyle">
							<tr>
								<td><h5>Questions</h5></td>
								<td><p:inputText size="50" /></td>
							</tr>
							<tr>
								<td><h5>Réponse</h5></td>
								<td><p:inputText size="50" /></td>
							</tr>
						</table></td>
				</tr>

				<tr>
					<td></td>
					<td><p:spacer width="75" height="10" /> <p:commandButton
							value="   +   " /></td>
				</tr>

			</table>

			<p:commandButton value="Passer à l’étape suivante"
				style="font-family:Times New Roman;color:white;background-color:#43ceff"
				action="#{enseigneMB.addEnseigne}" />

		</h:form>
	</ui:define>
</ui:composition>
